<template>
  <section class="GenderIcon__container">
    <i v-if="value == 0" class="iconfont icon-nan male" />
    <i v-if="value == 1" class="iconfont icon-nv female" />
  </section>
</template>

<script>
export default {
  props: {
    value: {
      type: Number,
      default: 1,
    },
  },
};
</script>

<style lang="scss" scoped>
.GenderIcon__container {
  i {
    font-size: 1.6rem;
    font-weight: bold;
  }

  .male {
    color: #409effbf;
  }

  .female {
    color: #f06292bf;
  }
}
</style>